<!DOCTYPE html>
<html
        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
        layout:decorate="~{base/layout}">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>消息中心-我的发布</title>
    <!--    <link rel="stylesheet" th:href="@{/chat/layui/css/layui.css}" type="text/css">-->
    <!--    <link rel="stylesheet" th:href="@{/chat/css/base.css}" type="text/css">-->
    <!--    <link rel="stylesheet" th:href="@{/chat/css/chats.css}" type="text/css">-->
    <!--    <link th:href="@{/lyear/css/style.min.css}" rel="stylesheet" type="text/css"/>-->
    <!--    <link th:href="@{/bootstrap/css/bootstrap.css}" rel="stylesheet" type="text/css">-->
</head>
<div layout:fragment="content">
    <div class="med_tittle_section">
        <div class="med_img_overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="med_tittle_cont_wrapper">
                        <div class="med_tittle_cont">
                            <ol class="breadcrumb">
                                <li><a th:href="@{/}">系统首页</a></li>
                                <li>消息中心</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="page-container" style="background-color: lavender;">
        <div class="container">
            <div class="row med_bottompadder50">
                <div class="col-lg-3 col-md-3 col-sm-4 col-xs-12">
                    <li style="font-size: x-large;margin-top: 20px;margin-bottom: 20px;">
                        <a th:href="@{/chat}" style="color: #839d85;">消息列表</a>
                    </li>
                    <div class="lyear-layout-sidebar-scroll">
                        <nav class="sidebar-main">
                            <ul class="nav nav-drawer">
                                <li class="nav-item" style="display: block;padding-top: 5px;padding-bottom: 5px;background-color: #4cae4c;font-size: 18px;border-bottom: #8fafe4 1px solid;">
                                    <a th:href="@{/chat}" style="color: #ffffff;">
                                        <i class="iconfont icon-home"></i>我的聊天</a>
                                </li>
                                <li class="nav-item" style="display: block;padding-top: 5px;padding-bottom: 5px;background-color: #4cae4c;font-size: 18px;border-bottom: #8fafe4 1px solid;">
                                    <a th:href="@{/auditResult}" style="color: #ffffff;">
                                        <i class="iconfont icon-home"></i>我的通知</a>
                                </li>
                                <li class="nav-item" style="display: block;padding-top: 5px;padding-bottom: 5px;background-color: white;font-size: 18px;border-bottom: #8fafe4 1px solid;border-left: 3px solid #4cae4c;">
                                    <a th:href="@{/information/mypush}" style="color: #4cae4c;">
                                        <i class="iconfont icon-home"></i>我的发布</a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
                <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
                    <div class="filter-type-box cy-tabs" style="background-color: transparent;margin-top: 20px">
                        <li class="pull-right">
                            <div class="search-tags">
                                <div align="right" style="float:right">
                                    <button type="button" id="push_recruitment" class="btn btn-default btn-warning">发布招工就业</button>
                                </div>
                            </div>
                        </li>
                    </div>

                    <div th:each="recruitmentDTO:${page.content}" class="cy-news-grid-item">
                        <div class="cy-news-thumbnail pull-left">
                            <a th:href="@{/information/recruitmentDetailsUI(id=${recruitmentDTO.id})}">
                                <img th:src="@{'/images/'+ ${recruitmentDTO.image} +'.jpg'}"  class="image_fade" alt="">
                            </a>
                        </div>
                        <div class="cy-media-body">
                            <div class="cy-grid-body">
                                <h5><a th:href="@{/information/recruitmentDetailsUI(id=${recruitmentDTO.id})}"
                                       th:text="'招聘单位 : ' + ${recruitmentDTO.address}"></a></h5>
                                <!--                                <small th:text="${recruitmentDTO.describe}"></small>-->
                                <div id ="editorContent"  th:utext="${recruitmentDTO.describe}" style="color: #9c9c9c;-webkit-line-clamp: 2;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;"></div>
                            </div>

                            <div class="cy-btm-info">
                                <div class="cy-btm-date"></div>
                                <div th:if="${recruitmentDTO.auditStatus} == '未审核'" class="cy-btm-tags">
                                    <a th:text="${recruitmentDTO.auditStatus}" style="font-weight: bold">审核状态</a>
                                </div>
                                <div th:if="${recruitmentDTO.auditStatus} == '审核通过'" class="cy-btm-tags">
                                    <a th:text="${recruitmentDTO.auditStatus}" style="color: #4fa718;font-weight: bold;">审核状态</a>
                                </div>
                                <div th:if="${recruitmentDTO.auditStatus} == '审核不通过'" class="cy-btm-tags">
                                    <a th:text="${recruitmentDTO.auditStatus}" style="font-weight: bold;color: #c93a3a;">审核状态</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div th:insert="~{base/pageable}"></div>


                    <!--编辑招工就业信息弹框-->
                    <div class="modal fade" id="exampleModal">
                        <div class="modal-dialog modal-lg" role="document">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                            aria-hidden="true">&times;</span></button>
                                    <h4 class="modal-title" id="exampleModalLabel">发布招工就业</h4>
                                </div>
                                <div class="modal-body">
                                    <form method="post" name="insertMember"
                                          id="insertMember" class="form-horizontal" enctype="multipart/form-data">
                                        <!--隐藏的-->
                                        <!--                                        <input type="text" id="id" name="id" hidden>-->

                                        <div id="companyDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>招聘单位:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="company" name="company">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="addressDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>单位地址:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="address" name="address">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="nameDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>联系人:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="name" name="name">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div id="telephoneDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                <label style="color: red">*</label>联系方式:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" id="telephone" name="telephone">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                        <div class="form-group m-b-10">
                                            <label class="col-sm-2 control-label">招聘描述：</label>
                                            <div class="col-sm-10">
                                                <div id="addDescEditor"></div>
                                                <input type="text" name="recruitmentDesc" id="addRecruitmentDesc"
                                                       style="display: none" />
                                            </div>
                                        </div>
                                        <div id="imageDiv" class="form-group m-b-10" style="text-align:right">
                                            <label class="col-sm-2 control-label">
                                                上传图片:
                                            </label>
                                            <div class="col-sm-6">
                                                <input type="file" id="file" name="file" onchange="uploadFile()" th:attr="testName='example'">
                                                <!--                                                <button type="button" id="uploadFile" value="确认" th:attr="uploadFileName='example'">确认</button>-->
                                                <img id="imagePosition" style="width: 100px !important; display: inherit">
                                                <span class="help-block"></span>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">返回</button>
                                    <button type="button" class="btn btn-info" onclick="saveForm()">提交</button>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <script th:src="@{/js/jquery_min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/js/wow.min.js}"></script>
    <script th:src="@{/js/custom.js}"></script>
    <script th:src="@{/plugins/slider-pro/js/jquery.sliderPro.min.js}"></script>
    <script th:src="@{/plugins/owlcarousel/js/owl.carousel.min.js}"></script>
    <script th:src="@{/layer/layer.js}"></script>

    <script th:src="@{/chat/layui/layui.all.js}"></script>
    <!--富文本编辑框js-->
    <script th:src="@{/js2/wangEditor.js}"></script>
    <script th:inline="javascript" type="text/javascript">
        function aaa(message) {
            alert(message);
        }

        // 触发招工就业发布框
        $(document).on("click", "#push_recruitment", function () {
            //限制富文本编辑器在模态框中的显示
            var E = window.wangEditor;
            var editor = new E('#addDescEditor');
            editor.customConfig.zIndex = 100;
            editor.customConfig.onchange = function(html) {
                // 监控变化，同步更新到 textarea
                textArea = html;
                $("#addDescEditor").val(html);
                $("#addRecruitmentDesc").val(html);
            }
            editor.create();
            //初始化显示内容
            editor.txt.html("<h1>欢迎编辑，请输入文字...</h1>");
            reset_form("#exampleModal form");
            // 显示模态框
            $("#exampleModal").modal({
                backdrop: "static"
            });
        });

        // 点击提交表单，包括information_recruitment
        function saveForm() {
            //name
            var company = $('#company').val();
            var address = $('#address').val();
            var name = $('#name').val();
            var telephone = $('#telephone').val();
            var describe = $('#addRecruitmentDesc').val();
            var image = $("#file").attr("testName");
            console.log(image);

            if (company.length === 0) {
                show_validate_msg("#company",
                    "error", "招聘单位不能为空");
                return false;
            }
            if (address.length === 0) {
                show_validate_msg("#address",
                    "error", "单位地址不能为空");
                return false;
            }
            if (name.length === 0) {
                show_validate_msg("#name",
                    "error", "联系人不能为空");
                return false;
            }
            if (telephone.length === 0) {
                show_validate_msg("#telephone",
                    "error", "联系方式不能为空");
                return false;
            }
            $.ajax({
                url: '/platform/information/addRecruitment',
                // data: $("#exampleModal form").serialize(),
                data: {
                    "company":company,
                    "address":address,
                    "name":name,
                    "telephone":telephone,
                    "describe":describe,
                    "image": image
                    // "file": file
                },
                // data: formData,
                type: 'post',
                dataType: 'json',
                success: function (result) {
                    if (result.code === 100) {
                        $("#exampleModal").modal('hide');
                        window.alert('招工就业信息提交成功！');
                        setTimeout(function () {
                            location.href = "/platform/information/mypush";
                        }, 1000);
                    } else {
                        layer.open({
                            title: '招工就业信息提交失败！',
                            content: result.message
                        });
                        // window.alert('招工就业信息提交失败！');
                    }
                }
            })
        }
        // 选择文件后提交
        function uploadFile(){
            var file = $("#file")[0].files[0];
            var formData = new FormData();
            formData.append("file", file);
            $("#file").attr("testName", file.name.substring(0, file.name.indexOf(".")));
            console.log($("#file").attr("testName"));
            $.ajax({
                url: '/platform/information/uploadFile',
                type: 'post',
                data: formData,
                processData: false,
                contentType: false,
                cache: false,
                success:function (result){
                    if (result.code === 100) {
                        window.alert("图片提交成功");
                        $("#imagePosition").attr("src", "/platform/images/" + file.name);
                    }else {
                        window.alert("图片提交失败");
                    }
                }
            })
        }

        //清空表单样式及内容
        function reset_form(ele) {
            $(ele)[0].reset();
            //清空表单样式
            $(ele).find("*").removeClass("has-error has-success");
            $(ele).find(".help-block").text("");
        }

        //显示校验结果的提示信息
        function show_validate_msg(ele, status, msg) {
            //清除当前元素的校验状态
            $(ele).parent().removeClass("has-success has-error");
            $(ele).next("span").text("");
            if ("success" === status) {
                $(ele).parent().addClass("has-success");
                $(ele).next("span").text(msg);
            } else if ("error" === status) {
                $(ele).parent().addClass("has-error");
                $(ele).next("span").text(msg);
            }
        }

        $('.filter-type-box span a').click(function () {
            if ($(this).hasClass('active'))
                $(this).removeClass('active')
            else
                $(this).addClass('active')
        });
        $('.cy-summary-intro p').each(function () {
            var maxwidth = 260;
            var backup = $(this).html();
            var height_lg = $(this).parent().height();
            if ($(this).text().length > maxwidth) {
                $(this).text($(this).text().substring(0, maxwidth));
                $(this).html($(this).html() + '...');
                var backup_1 = $(this).html();
                var height_sm = $(this).parent().height();
                $(this).parent().css('height', height_sm);
            }
            var d_value = height_lg - height_sm;
        });

    </script>
</div>
</html>